<template>
	<view>
		<Header :title="'我的'" :isBack='false' :bgColor='bgColor' :color="'#fff'"></Header>
		<view class="mine">
			<view class="top">
				<view v-if="islogin"  class="userInfo" @click="eidt" >
					<image :src="headimgurl" mode=""></image>
					<view class="box" >
						<view class="name line1">{{nickname}}</view>
						<view v-if="info.is_paid==1" class="type">{{info.factory_name}}</view>
						<view v-else class="members" @tap.stop="members">
							成为会员
						</view>
					</view>
				</view>
				<view class="loginbox" v-if="!islogin" @tap="getnav(router(`login`))">
					<view class="name line1">点击登录</view>
				</view>
			</view>
			<view class="nav">
				<view class="mBox">
					<view class="disFlex">
						<view class="word">整装订单</view>
						<view class="next word2" @tap="getnav(router(`myOrder?type=0`))">查看全部</view>
					</view>
					<view class="orderType">
						<view class="types" @tap="getnav(router(`myOrder?type=0`))">
							<image src="../../static/img/order1.png" mode=""></image>
							<view>待签约</view>
						</view>
						<view class="types" @tap="getnav(router(`myOrder?type=1`))">
							<image src="../../static/img/order2.png" mode=""></image>
							<view>已签约</view>
						</view>
						<view class="types" @tap="getnav(router(`myOrder?type=2`))">
							<image src="../../static/img/order3.png" mode=""></image>
							<view>待施工</view>
						</view>
						<view class="types" @tap="getnav(router(`myOrder?type=3`))">
							<image src="../../static/img/order4.png" mode=""></image>
							<view>待验收</view>
						</view>
						<view class="types" @tap="getnav(router(`myOrder?type=4`))">
							<image src="../../static/img/order5.png" mode=""></image>
							<view>已完成</view>
						</view>
					</view>
				</view>
				
				<view class="mBox marginTop10">
					<view class="">
						<view class="word">我的招标</view>
					</view>
					<view class="other">
						<!-- <view class="otherTypes" @tap="getnav(router(`myCustomized?type=0`))">
							<image src="../../static/img/icon1.png" mode=""></image>
							<view>招标中</view>
						</view>
						<view class="otherTypes" @tap="getnav(router(`alternativeFactory?id=${''}`))">
							<image src="../../static/img/icon2.png" mode=""></image>
							<view>备选工厂</view>
						</view>
						<view class="otherTypes" @tap="getnav(router(`winningthebidFactory?id=${''}`))">
							<image src="../../static/img/icon3.png" mode=""></image>
							<view>中标工厂</view>
						</view> -->
						<!-- <view class="otherTypes" @tap="info.is_design==0?getnav(router(`company?type=${info.is_design}`)):getnav(router(`companyDetail`))">
							<image src="../../static/img/icon3.png" mode=""></image>
							<view>设计公司</view>
						</view>	 -->
						<view class="otherTypes" @tap="todesign">
							<image src="../../static/img/icon3.png" mode=""></image>
							<view>设计合作</view>
						</view>	
					</view>
				</view>
				
				<view class="mBox marginTop10">
					<view class="disFlex ">
						<view class="word">我的租赁</view>
						<view class="paddingRight15 next" @tap="getnav(router(`myRentOrder?type=${''}`))">查看全部</view>
					</view>
					<view class="other">
						<view class="otherTypes" @tap="getnav(router(`myRentList`))">
							<image src="../../static/img/icon4.png" mode=""></image>
							<view>租赁清单</view>
						</view>
						<view class="otherTypes" @tap="getnav(router(`myRentOrder?type=${''}`))">
							<image src="../../static/img/mydd.png" mode=""></image>
							<view>我的订单</view>
						</view>
						<view class="otherTypes" @tap="getnav(router(`myShipping`))">
							<image src="../../static/img/icon5.png" mode=""></image>
							<view>租赁地址</view>
						</view>
					</view>
				</view>
				
				<view class="mBox marginTop10">
					<view class="">
						<view class="word">工厂合作</view>
					</view>
					<view class="other" >
						<!-- <view class="otherTypes" @tap="info.is_factory==0?getnav(router(`shopApplication?type=${info.is_factory}`)):getnav(router(`shopApplicationDetail`))" >
							<image src="../../static/img/icon6.png" mode=""></image>
							<view>申请合作</view>
						</view> -->
						<view class="otherTypes" @tap="tofactory" >
							<image src="../../static/img/icon6.png" mode=""></image>
							<view>申请合作</view>
						</view>
						<!-- <view class="otherTypes" @tap="getnav(router(`myBid`))">
							<image src="../../static/img/icon7.png" mode=""></image>
							<view>我的投标</view>
						</view> -->
					</view>
				</view>
				
				
				<view class="mBox marginTop10">
					<view class="">
						<view class="word">个人服务</view>
					</view>
					
					<view class="other">
						<view class="otherTypes" @tap="getnav(router(`myNumber?integral=${info.integral}`))">
							<image src="../../static/img/icon8.png" mode=""></image>
							<view>我的积分</view>
						</view>
						
						<view class="otherTypes" @tap="getnav(router(`collectProgramme`))">
							<image src="../../static/img/icon9.png" mode=""></image>
							<view>我的收藏</view>
						</view>
						<view class="otherTypes" @tap="getnav(router(`systemInfoList?ip=/api/user_msg/index`))" >
							<image src="../../static/img/icon10.png" mode=""></image>
							<view>消息</view>
						</view>
						<view class="otherTypes" @tap="getnav(router(`feedBack`))">
							<image src="../../static/img/icon11.png" mode=""></image>
							<view>意见反馈</view>
						</view>
						<view class="otherTypes" @tap="call">
							<image src="../../static/img/icon12.png" mode=""></image>
							<view>客服电话</view>
						</view>
						<view class="otherTypes" @tap="getnav(router(`setting`))">
							<image src="../../static/img/icon13.png" mode=""></image>
							<view>设置</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				islogin:false,
				bgColor:'linear-gradient(90deg,rgba(34,145,255,1) 0%,rgba(93,173,252,1) 100%);',
				userid:'',
				token:'',
				info:'',
				headimgurl:'',
				nickname:'',
				isdesign:false,
			}
		},
		onLoad() {
			this.userid=uni.getStorageSync('userinfo').id;
			this.token=uni.getStorageSync('userinfo').token;
		},
		onShow(){
			this.loginstyle()
			if(this.userid){
				this.getuserinfo()
			}
		},
		methods: {
			eidt(){
				uni.navigateTo({
					url:`/pages/mine/myData/myData?user=${encodeURIComponent(JSON.stringify(this.info))}`
				})
			},
			loginstyle(){
				this.userid=uni.getStorageSync('userinfo').id;
				this.token=uni.getStorageSync('userinfo').token;
				if(this.userid){
					this.islogin=true
				}else{
					this.islogin=false
				}
			},
			getuserinfo(){
				this.http('/api/user/read', 'post', {})
				.then((res)=>{
					console.log(res)
					if(res.sta==200){
						this.headimgurl=res.data.headimgurl;
						this.nickname=res.data.nickname;
						this.info=res.data;
						uni.setStorageSync('members',res.data.is_paid)
					}else if(res.code==2002){
						this.islogin=false
					}
				})
			},
			call () {
				this.http('/api/setting/read', 'post', {code:'service_phone'})
				.then((res)=>{
					console.log(res)
					uni.makePhoneCall({
						phoneNumber:res.data.data
					})
					
				})
			},
			members(){
				uni.showModal({
					title:'成为会员后才能进行身份认证',
					content:'是否要成为会员？',
					cancelColor:'#BEC9D7',
					confirmText:'支付',
					success: (e) => {
						if (e.confirm) {
								let openid=uni.getStorageSync('userinfo').openid;
								this.http('/api/user/order', 'post', {openid})
								.then((res)=>{
									console.log(res)
									uni.requestPayment({
									    provider: 'wxpay',
									    timeStamp: res.msg.time,
									    nonceStr: res.msg.nonce_str,
									    package: res.msg.package,
									    signType: "MD5",
									    paySign: res.msg.sign,
									    success: function (res) {
									        uni.showToast({ title: '支付成功!', icon: 'none' })
									        setTimeout(()=>{
									        	
									        	uni.redirectTo({
									        		url:`/pages/index/pay/paySuccess?ip=mine`
									        	})
												
									        },1000)
									    },
									    fail: function (err) {
									       uni.showToast({ title: '支付失败!', icon: 'none' })
										   uni.redirectTo({
										   	url:`/pages/index/pay/payFail?ip=mine`
										   })
									       
									    }
									});
								})
						}
					}
				})
			},
			tofactory(){
				if(this.info.is_paid==1){
					if(this.info.is_factory==0){
						this.getnav(this.router(`shopApplication?type=${this.info.is_factory}`))
					}else{
						this.getnav(this.router(`shopApplicationDetail`))
					}
				}else{
					uni.showToast({
						title:'需要成为会员才能进行认证',
						icon:'none'
					})
				}
				
			},
			todesign(){
				if(this.info.is_paid==1){
					if(this.info.is_design==0){
						this.getnav(this.router(`company?type=${this.info.is_design}`))
					}else{
						this.getnav(this.router(`companyDetail`))
					}
				}else{
					uni.showToast({
						title:'需要成为会员才能进行认证',
						icon:'none'
					})
				}
			},
		}
	}
</script>

<style lang="less">
	page{
		background-color: #F5F5F9;
	}
	.mine{
		overflow-x: hidden;
		
		.top{
			height: 400rpx;
			padding: 0 40rpx;
			background:linear-gradient(90deg,rgba(34,145,255,1) 0%,rgba(93,173,252,1) 100%);
			.userInfo{
				padding-top: 90rpx;
				display: flex;
				align-items: center;
				image{
					width: 120rpx;
					height: 120rpx;
					border-radius: 50%;
				}
				.box{
					margin-left: 20rpx;
					margin-right: 20rpx;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					padding: 16rpx 0 ;
					height: 120rpx;
					flex: 1;
					position: relative;
					.members{
						position: absolute;
						top: 23rpx;
						right: 200rpx;
						border: 1px solid #ffaa00;
						border-radius: 10px;
						color: #ffaa00;
						padding: 5rpx;
					}
					&::after{
						position: absolute;
						content: '';
						width: 16rpx;
						height: 16rpx;
						border-top: 2px solid #fff;
						border-left: 2px solid #fff;
						right: 6rpx;
						top: 50%;
						transform: translateY(-50%) rotate(135deg);
					}
					.type{
						font-size:24rpx;
						color:rgba(255,255,255,.8);
					}
				}
			}
		}
		.name{
			font-size:36rpx;
			color: #fff;
			font-weight: bold;
		}
		.loginbox{
			padding-top: 100rpx;
		}
		.nav{
			padding: 0 20rpx;
			transform: translateY(-115rpx);
			.mBox{
				background-color: #fff;
				// height:230rpx;
				background:rgba(255,255,255,1);
				border-radius:20rpx;
				padding: 30rpx;
				.word{
					font-size:32rpx;
					font-weight:bold;
					color:rgba(38,38,38,1);
				}
				.word2{
					color:rgba(190,201,215,1);
					padding-right: 30rpx;
				}
				.orderType{
					padding-top: 30rpx;
					display: flex;
					justify-content: space-between;
					align-items: center;
					.types{
						display: flex;
						align-items: center;
						flex-direction: column;
						padding-top: 30rpx;
						image{
							width: 44rpx;
							height: 44rpx;
						}
						view{
							padding-top: 18rpx;
							font-size:24rpx
						}
					}
					
				}
				.other{
					display: flex;
					align-items: center;
					flex-wrap: wrap;
					width: calc(100% + 100rpx);
					.otherTypes{
						display: flex;
						padding-top: 30rpx;
						align-items: center;
						flex-direction: column;
						margin-right: 100rpx;
						image{
							width: 44rpx;
							height: 44rpx;
						}
						view{
							padding-top: 18rpx;
							font-size:24rpx
						}
					}
				}
			}
		}
	}
</style>
